package cae.windows
{
	import mx.containers.ViewStack;
	import mx.containers.HBox;
	import mx.containers.VBox;
	import mx.controls.Button;
	import mx.collections.ArrayCollection;
	import flash.display.DisplayObject;
	import org.efflex.mx.viewStackEffects.CoverFlowPapervision3D;
	import mx.effects.easing.Circular;
	import mx.effects.TweenEffect;
	import mx.events.FlexEvent;
	import flash.events.MouseEvent;
	import mx.core.UIComponent;
	import mx.controls.Label;
	
	public class CaeViewStackWindow extends CaeWindow
	{
		private var area:VBox;
		private var stack:ViewStack;
		private var buttonBar:HBox;
	
		private var atras:Button;
		private var adelante:Button;
		
		private var avance:Label;
		
		private var effect:CoverFlowPapervision3D;
		
		public var productos:ArrayCollection = new ArrayCollection();

		public function CaeViewStackWindow()
		{
			super();
			
			effect = new CoverFlowPapervision3D();
			effect.easingFunction = Circular.easeInOut;
			effect.angle = 0;
			effect.offset = 5000;
			effect.duration = 900;
			
			addEventListener(FlexEvent.CREATION_COMPLETE, creationComplete);
		}
		


		override protected function createChildren():void
		{
			super.createChildren();
			
			area = new VBox();
			area.percentHeight = 100;
			area.percentWidth = 100;
			area.setStyle("paddingBottom", 10);
			area.setStyle("paddingLeft", 10);
			area.setStyle("paddingRight", 10);
			area.setStyle("paddingTop", 20);
			area.setStyle("horizontalAlign", "center");
			addChild(area);
			
			stack = new ViewStack();
			stack.percentHeight = 100;
			stack.width = 650;
			area.addChild(stack);
			
			buttonBar = new HBox();
			buttonBar.percentWidth = 100;
			buttonBar.setStyle("horizontalAlign", "center");
			buttonBar.setStyle("verticalAlign", "middle");
			area.addChild(buttonBar);
			
			atras = new Button();
			atras.label = "Atras";
			atras.styleName = "buttonViewStack";
			atras.setStyle("cornerRadii", [10, 0, 0, 10]);
			atras.height = 30;
			atras.addEventListener(MouseEvent.CLICK, retrodecer);
			buttonBar.addChild(atras);
			
			adelante = new Button();
			adelante.label = "Adelante";
			adelante.setStyle("cornerRadii", [0, 10, 10, 0]);
			adelante.styleName = "buttonViewStack";
			
			//cornerRadii: 10, 0, 0, 10;
			
			adelante.height = 30;
			adelante.addEventListener(MouseEvent.CLICK, avanzar);
			buttonBar.addChild(adelante);
			
			avance = new Label();
			buttonBar.addChild(avance);
			
			for each(var a:UIComponent in productos)
			{
				stack.addChild(a);
				
				a.setStyle("hideEffect", effect);
				a.setStyle("showEffect", effect);
			}
		}
		
		
		
		private function creationComplete(e:FlexEvent):void
		{
			index = Number(dataId)-1;
		}
			
		private function retrodecer(e:MouseEvent=null):void
		{
			if(index > 0)
				index = index -1;
		}
		
		private function avanzar(e:MouseEvent=null):void
		{
			if(index < stack.numChildren-1)
				index = index+1;
		}
		
		public function set index(i:int):void
		{
			stack.selectedIndex = i;
			
			if(index == 0)
				atras.enabled = false;
			else
				atras.enabled = true;
				
			if(index == stack.numChildren-1)
				adelante.enabled = false;
			else
				adelante.enabled = true;
				
			avance.text = i+1 + " / " + productos.length;
		}
		
		public function get index():int
		{
			return stack.selectedIndex;
		}
	}
}